<template>
  <Back />
  <div>
    <van-empty v-if="list.finished && list.data.length < 1" :description="$t('common.noData')" />
    <van-list
      v-if="!list.finished || list.data.length > 0"
      v-model:loading="list.loading"
      :finished="list.finished"
      @load="getList"
      :immediate-check="false"
    >
      <div v-for="item in list.data" :key="item.id" class="record">
        <div class="font-size-1.2rem color-#666666 m-b-0.6rem">{{ item.createTime }}</div>
        <div class="font-size-1.6rem m-b-0.6rem">{{ item.newUsername }} {{ $t('invite.records.invite') }}</div>
      </div>
    </van-list>
  </div>
</template>

<script setup lang="ts">
const { getList, list } = useList(apis.api.userAssetInvites)

onMounted(async () => {
  list.loading = true
  getList()
})
</script>
<style lang="scss" scoped>
.record {
  margin: 20px 20px 0;
  border: 1px solid #dcdcdc;
  border-radius: 4px;
  padding: 8px 20px;
}
.red {
  color: #fb553c;
}
</style>
